<template>
    <div>
        <div id="bingtu" style="width:250px; height:300px;background-color: #fff;"> 用户群流量占比</div>
    </div>
</template>

<script>
export default {
    name: 'chart',
    data() {
        return {
            chart: null,
            options: {}
        }
    },
    mounted() {
        this.initOptions()
        this.initBingtu()
    },
    methods: {
        initOptions() {
            this.options = {
                series: [
                    {
                        type: 'pie',
                        data: [
                            {
                                value: 4976,
                                color:'#0076DE'
                             
                            },
                            {
                                value: 2355,
                                 color:'#60BFF3'
                             
                            },
                            {
                                value: 1619,
                                color:'#40CB91'
                            },
                            {
                                value:782,
                                color:'#FFAE23'
                            },
                            {
                                value:621,
                                color:'#FCE222'
                            }
                        ],
                        itemStyle:{
                            normal:{
                                label:{
                                    show:true,
                                    formatter:'{b}  {d}%',
                                    position:'inside',
                                    color:'#fff'
                                }
                            }
                        },
                    }
                ],


            }
        },
        initBingtu() {
                this.bingtu = this.$echarts.init(document.getElementById('bingtu'))
                this.bingtu.setOption(this.options)
            }
    }
}
</script>
<style>

</style>